<template>
	<!-- 查看详情 -->
	<el-dialog
		:title="$t('game.game_betslip.note_details')"
		:visible="detailDialog.visible"
		width="1500px"
		append-to-body
		:destroy-on-close="true"
		:before-close="handleClose"
		@close="handleClose"
	>
		<div class="game-container report-container" v-loading="loading">
			<div class="view-container dealer-container">
				<notedetails
					:dataList="dataList"
					:lookMsgList="lookMsgList"
				></notedetails>
				<div v-for="(detailItem, index) in betHisDetails" :key="index">
					<realDetails
						v-if="venueTypeCode === 'zr'"
						:dataList="detailItem"
						:lookMsgList="lookMsgList"
					></realDetails>
					<chessDetails
						v-else-if="venueTypeCode === 'qp'"
						:dataList="detailItem"
						:lookMsgList="lookMsgList"
					></chessDetails>
					<sportDetails
						v-else-if="venueTypeCode === 'ty'"
						:dataList="detailItem"
						:lookMsgList="lookMsgList"
					></sportDetails>
					<eSportDetails
						v-else-if="venueTypeCode === 'dj'"
						:dataList="detailItem"
						:lookMsgList="lookMsgList"
					></eSportDetails>
					<lotteryDetails
						v-else-if="venueTypeCode === 'cp'"
						:dataList="detailItem"
						:lookMsgList="lookMsgList"
					></lotteryDetails>
					<eGameDetails
						v-else-if="venueTypeCode === 'dy'"
						:dataList="detailItem"
						:lookMsgList="lookMsgList"
					></eGameDetails>
					<regionalChain
						v-else-if="venueTypeCode === 'qkl'"
						:dataList="detailItem"
						:lookMsgList="lookMsgList"
					></regionalChain>
					<dzDetails
						v-else-if="venueTypeCode === 'DZ_CARD'"
						:dataList="detailItem"
						:parentBetTypes="parentBetTypes"
						:parentBetSubTypes="parentBetSubTypes"
						:lookMsgList="lookMsgList"
					></dzDetails>
					<slotDetails
						v-else
						:dataList="detailItem"
						:lookMsgList="lookMsgList"
					></slotDetails>
				</div>
			</div>
		</div>

		<div class="arrowStyel">
			<div>
				<el-button @click="detailDialog.visible = false">
					{{ $t('member.close') }}
				</el-button>
			</div>
		</div>
	</el-dialog>
</template>

<script>
import list from '@/mixins/list'
import gameMixins from '../mixins/index'
import notedetails from './components/Notedetails'
import realDetails from './components/realDetails'
import chessDetails from './components/chessDetails'
import sportDetails from './components/sportDetails'
import eSportDetails from './components/eSportDetails'
import lotteryDetails from './components/lotteryDetails'
import eGameDetails from './components/eGameDetails'
import slotDetails from './components/slotDetails'
import dzDetails from './components/dzDetails'
import regionalChain from './components/regionalChain'

export default {
  components: {
    notedetails,
    realDetails,
    chessDetails,
    sportDetails,
    eSportDetails,
    lotteryDetails,
    eGameDetails,
    slotDetails,
    regionalChain,
    dzDetails // 德州详情
  },
  mixins: [list, gameMixins],
  props: {
    tableData: {
      type: Array,
      default: () => []
    },
    lookMsgList: {
      type: Object,
      default: () => { }
    },
    curIdx: {
      type: Number,
      default: 0
    },
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      detailDialog: {
        visible: this.visible,
        currentRecordIndex: this.curIdx
      },
      dataList: {},
      betHisDetails: [],
      gameList: [],
      venueTypeCode: 'init'
    }
  },
  created() {
    this.getdetailsdata(this.lookMsgList)
  },
  methods: {
    getdetailsdata(val) {
      const data = {}
      data.id = val.orderNo
      this.loading = true
      this.dataList = {}
      this.betHisDetails = []

      // 是否重算
      if (val.obSettleCount > 0 && !this.isReset) {
        this.$api
          .getResettlementGameRecordDetails(data)
          .then((res) => {
            if (res.code === 200) {
              this.betHisDetails = res.data.betHisDetails
              this.dataList = res.data
              this.venueTypeCode = val.venueCode || 'init'
            }
            this.loading = false
          })
          .catch(() => {
            this.loading = false
          })
        return
      }
      this.fetchDetailApi(data)
        .then((res) => {
          if (res?.code === 200) {
            this.dataList = res.data
            this.gameList = res.data.betDetails
            this.betHisDetails = [res.data]
            this.venueTypeCode = val.venueCode || 'init'
            this.loading = false
          }
        })
        .catch(() => {
          this.loading = false
        })
    },
    handleClose() {
      this.$emit('update:visible', false)
    }
  }
}
</script>

<style lang="scss" scoped>
.arrowStyel {
	display: flex;
	justify-content: space-around;
}
</style>
